<!DOCTYPE html>
<html>
  <head>
    <title>個人首頁</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="homecss.css">
  </head>
  <body>
    <div class="container">
      <div class="bar">
        <img class="imglog" src="../img/log.png" />
        <ul class="barlist">
          <li>
            <a href="index.html" target="_blank">造型百货</a>&nbsp;|&nbsp;
          </li>
          <li>
            <a href="http://10.151.110.165/ormit/forum/index" target="_blank">讨论区</a>&nbsp;|&nbsp;
          </li>
          <li> 精密机械加工
            <ul>
              <li><a href="http://10.151.110.165/ormit/forum/index" target="_blank">論壇</a></li>
              <li><a href="https://10.151.110.165/wiki/index.php/%E9%A6%96%E9%A0%81" target="_blank">WiKi</a></li>
              <li><a href="http://itsm.efoxconn.com/" target="_blank">C次之家咨询服务平台</a></li>
            </ul>
          </li>
        </ul>
      </div>
      <div class="lefthouse">
        <label class="housetitle">冒险者小屋</label>
        <div class="house-content">
          <img src="../img/sd4.png"/>
        </div>
      </div>
      <div class="tablist">
        <input id="tab-commodity" type="radio" name="grp" checked="checked">
        <label class="tablab" for="tab-commodity">热门商品</label>
        <div class="tab-content">
          <ul class="ul-commodity">
            <li>
              <div class="prompt">
                <div>圣诞夫人帽</div>
                <p>类型:时装&nbsp;&nbsp;&nbsp;装备栏位:社交头盔 它由礼物掉落</p>
              </div>
              <img src="../img/sd3.png" class="content-img"/>
              <div>
                <label class="img-title">圣诞夫人帽</label>
                <label class="img-price">$60</label>
                <p><button>試穿</button> <button>購買</button></p>
              </div>
            </li>
            <li>
              <div class="prompt">
                <div>圣诞夫人衣</div>
                <p>类型:时装&nbsp;&nbsp;&nbsp;装备栏位:社交上衣 它由礼物掉落</p>
              </div>
              <img src="../img/sd1.png" class="content-img"/>
              <div>
                <label class="img-title">圣诞夫人衣</label>
                <label class="img-price">$60</label>
                <p><button>試穿</button><button>購買</button></p>
              </div>
            </li>
            <li>
              <div class="prompt">
                <div>圣诞夫人高跟鞋</div>
                <p>类型:时装&nbsp;&nbsp;&nbsp;装备栏位:社交裤装 它由礼物掉落</p>
              </div>
              <img src="../img/sd2.png" class="content-img" />
              <div>
                <label class="img-title">圣诞夫人鞋</label>
                <label class="img-price"><label class="discount-price">$49</label>$79</label>
                <p><button>試穿</button><button>購買</button></p>
              </div>
            </li>
          </ul>
        </div>
        <input id="tab-modelling" type="radio" name="grp">
        <label class="tablab" for="tab-modelling">造型</label>
        <div class="tab-content">
          <ul class="ul-modelling">
            <li>
              <div class="prompt">
                <div>綠色夏威夷帽</div>
                <p>來去夏威夷~帶上這頂帽子就可以體會夏威夷的風情!</p>
              </div>
              <img class="content-img" />
              <div>
                <label class="img-title">綠色夏威夷帽</label>
                <label class="img-price"><label class="discount-price">$49</label><label class="coust">$79</label></label>
                <p><button>試穿</button><button>購買</button></p>
              </div>
            </li>
            <li>
              <div class="prompt">
                <div>綠色夏威夷帽</div>
                <p>來去夏威夷~帶上這頂帽子就可以體會夏威夷的風情!</p>
              </div>
              <img class="content-img" />
              <div>
                <label class="img-title">綠色夏威夷帽</label>
                <label class="img-price">$79</label>
                <p><button>試穿</button><button>購買</button></p>
              </div>
            </li>
          </ul>
        </div>

        <input id="tab-accessories" type="radio" name="grp">
        <label class="tablab" for="tab-accessories">饰品</label>
        <div class="tab-content">... no fixed height for tabbed area!</div>
        <input id="tab-pet" type="radio" name="grp">
        <label class="tablab" for="tab-pet">宠物</label>
        <div class="tab-content">we</div>
        <input id="tab-else" type="radio" name="grp">
        <label class="tablab" for="tab-else">其他</label>
        <div class="tab-content">ss</div>
        <input id="tab-skin" type="radio" name="grp">
        <label class="tablab" for="tab-skin">Skin</label>
        <div class="tab-content">ccvc</div>
      </div>
    </div>
  </body>
</html>